<template>
    <div id="list" :class="{srcc:dd}">
        <div id="list_d1">
            <dl class="list-dl" v-for="(item, index) in shops" :key="index">
                <dt class="list-dt"><div class="list-d2"><strong class="list-strong">{{item.name}}</strong><span class="list-span1">{{item.description}}</span></div></dt>
                <dd class="list-dd" v-for="(values, indexs) in item.foods" :key="indexs">
                    <div class="list-d3">
                        <span class="list-span2"><img class="list-img" :src="values.image_path" alt=""></span>
                        <section class="list-section">
                            <p class="list-p1"><span class="list-span3">{{values.name}}</span></p>
                            <p class="list-p2">{{values.description}}</p>
                            <p class="list-p3"><span class="list-span4">月售{{values.month_sales}}份</span><span class="list-span5">好评率{{values.satisfy_rate}}%</span></p>
                            <div></div>
                            <span class="list-span6"><span class="list-span7">¥{{values.specfoods[0].price}}</span></span>
                            <div class="list-d4"><span class="iconfont list-span8">&#xe602;</span></div>
                        </section>
                    </div>
                </dd>
            </dl>
        </div>
    </div>
</template>
<script>
export default {
    props:{
        'shops': Array,
        'dd':Boolean
    },
}
</script>
<style lang="stylus" scoped>
    #list
        height 100%
        position relative
        width: 79vw;
        box-sizing border-box
        border 1px solid #f00
        // margin-left 21vw
        z-index 99
    .srcc
        margin-left 21vw
    #list_d1
        overflow-y auto
        height 100%
        .list-dl
            .list-dt
                position relative
                margin-left 2.666667vw
                padding 2vw 8vw 2vw 0
                .list-d2
                    -webkit-box-align center
                    display flex
                    align-items center
                    overflow hidden
                    .list-strong
                        margin-right 1.333333vw
                        font-weight 700
                        font-size .32rem
                        color #666
                        -webkit-box-flex 0
                        flex none
                    .list-span1
                        flex 1
                        color #999
                        font-size .266667rem
                        white-space nowrap
                        overflow hidden
                        text-overflow ellipsis
            .list-dd
                position: relative;
                margin 0
                min-height 30.666667vw
                padding-left 2.666667vw
                .list-d3
                    padding 2.666667vw 0
                    margin-bottom 1px
                    display flex
                    min-height 27.466667vw
                    position relative
                    .list-span2
                        width 25.333333vw
                        height 25.333333vw
                        -webkit-box-flex 0
                        flex none
                        margin-right 2.666667vw
                        position relative
                        .list-img
                            width 100%
                            border-radius .533333vw
                    .list-section
                        flex 1
                        position relative
                        padding-bottom 6.666667vw
                        padding-right 4vw
                        .list-p1
                            font-size .4rem
                            font-weight 700
                            position relative
                            padding-right 4vw
                            overflow hidden
                            display flex
                            -webkit-box-align start
                            align-items start
                            word-break break-word
                            .list-span3
                                font-size .4rem
                                font-weight 700
                        .list-p2
                            margin 1.333333vw 0
                            font-size .266667rem
                            color #999
                            overflow hidden
                            text-overflow ellipsis
                            white-space nowrap
                            width 42.666667vw
                        .list-p3
                            margin 1.733333vw 0!important
                            color #999
                            font-size .266667rem
                            line-height 1
                            .list-span4
                                color #999
                                font-size .266667rem
                                line-height 1
                            .list-span5
                                margin-left 1.066667vw
                                vertical-align middle
                        .list-span6
                            font-size .48rem
                            line-height 4.266667vw
                            color #ff5339
                            padding-bottom .933333vw
                            display flex
                            -webkit-box-align baseline
                            align-items baseline
                            position absolute
                            bottom 0
                            .list-span7
                                font-size .48rem
                                line-height .426667rem
                                line-height 4.266667vw
                                color #ff5339
                                margin-right .266667vw
                        .list-d4
                            position absolute
                            right 4vw
                            bottom .666667vw
                            .list-span8
                                font-size .5rem
                                color #2396ff

</style>

